<html>

	<head>

		<meta charset="utf-8" />

		<title>LIGHTBOX EXAMPLE</title>

		<style>
		/*	折叠层*/
			.black_overlay {
				display: none;
				position: absolute;
				top: 0%;
				left: 0%;
				width: 100%;
				height: 100%;
				background-color: black;
				z-index: 1001;
				-moz-opacity: 0.6;
				opacity: .60;
				filter: alpha(opacity=60);
			}
			
			.white_content {
				display: none;
				position: absolute;
				top: 25%;
				left: 25%;
				width: 50%;
				height: 50%;
				padding: 16px;
				/*border: 16px solid orange;*/
				background-color: white;
				z-index: 1002;
				overflow: auto;
			}
		</style>

		<script>
			function one() {

				document.getElementById('light').style.display = 'block';

				document.getElementById('fade').style.display = 'block'

			}

			function two() {
				document.getElementById('light').style.display = 'none';
				document.getElementById('fade').style.display = 'none'

			}
		</script>

	</head>

	<body>

		<p>可以根据自己要求修改css样式

			<a href="javascript:void(0)" onclick="one()">点击这里打开窗口</a>

		</p>

		<div id="light" class="white_content">

			<form>
				请输入 菜单名字 :<input type="text" /><br>
				请输入 菜单访问路径 :<input type="text" /><br>
			</form>

			<a href="javascript:void(0)" onclick="two()">Close</a>

		</div>

		<div id="fade" class="black_overlay">

		</div>

	</body>

</html>